<template>
  <!-- <Card class="histogram-chart" :bordered="false"> :dataZoom="dataZoom"-->
  <ve-bar
    height="400px"
    :colors="['#317dfb', '#4ece17']"
    :data="chartData1"
  ></ve-bar>
  <!-- </Card> -->
</template>

<script>
export default {
  data() {
    return {
      dataZoom: {
        type: "slider", // 滑动条
        show: true, // 开启
        xAxisIndex: [0],
        // left: '93%', // 滑动条位置
        start: 0, // 初始化时，滑动条宽度开始标度
        end: 80, // 初始化时，滑动条宽度结束标度
        bottom: 0,
      },
      chartData1: {
        columns: ["gpuType", "val1", "val2"],
        rows: [
          { gpuType: "test1", val1: 3, val2: -1 },
          { gpuType: "test2", val1: 1, val2: 2 },
          { gpuType: "test3", val1: 3, val2: 3 },
          { gpuType: "test4", val1: 2, val2: 1 },
          { gpuType: "test5", val1: 4, val2: 1 },
        ],
      },
    };
  },
};
</script>
